<template>
    <!-- 组件的模板 -->
    <div class="main">
        <div class="my_wallet">
            <header class="clfff"  ref="header">
                <p class=" tc"><span class="money">{{balance}}</span><span class="unit_yuan">余额 (元)</span></p>
                <!-- <p class="ft14 tc" v-if="freeze_balance > 0">含{{freeze_balance}}冻结金额</p> -->
                <i class="header-bj"></i>
            </header>

            <div class="reflect_record" v-if="!empty" :style="{height:iPhoneX ? Height - 34 + 'px' : Height + 'px'} " @scroll="listScroll($event)">
                <ul class="reflect_list">
                    <li v-for="(index,item) in detailList" :key="index">
                        <div class="flexgrow">
                            <p class="ft16">{{item.title}}</p>
                            <p class="ft12 cl40">账单类型：{{item.record_type}}</p>
                            <p class="ft12 clb3 word_wrap">备注：{{item.remark}}</p>
                        </div>
                        <div class="tr wh_123">
                            <p class="ft12 clb3 ws">{{parseInt(item.create_at) | formatDateTime}}</p>
                            <p class="ft24 cl40 amount">{{item.direction == 1 ? '+' : '-'}}{{item.amount}}</p>
                            <p class="ft12 clb3 stauts"> ({{item.listing_status}})</p>
                        </div>
                    </li>
                </ul>
                <div class="page__bd" v-show="showMore">
                    <div class="weui-loadmore">
                       <i class="weui-loading"></i>
                       <span class="weui-loadmore__tips">正在加载</span>
                    </div>
                </div>
                <!-- <p class="segmentation ft12 clb3">三个月以前</p> -->
            </div>
            <div class="empty" v-if="empty">
                <div class="empty_text">当前无项目</div>
            </div>
             <div class="btn-box bg-colorbtn fixed" @click='withdrawal' :style="{bottom:iPhoneX ? '34px' : '0'}"><a href="javascript:;" class="weui-btn weui-btn_primary">全部提现</a></div>
            
        </div>
    </div>
    <div class="page__bd" v-show="showMore">
        <div class="weui-loadmore">
           <i class="weui-loading"></i>
           <span class="weui-loadmore__tips">正在加载</span>
        </div>
    </div>
    
</template>

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import * as util from 'js/util.js'
    import widget from 'gapi/widget'
    import commonPage from 'clientApi/commonPage.js'
    import cache from 'gapi/cache.js'
    // import ApiClientUi from 'clientApi/ApiClientUi.js'

    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */
    import bottomLoading from 'components/Bottomloading/Bottomloading'
    /**
     *  组件实例对象
     */
    export default {
        components: {
            bottomLoading,
        },
        data: function(){
            return{
                empty:false,
                balance:'',
                freeze_balance:0,
                Height:'',
                detailList:[],
                debounce:false,
                page:1,
                last_page:0,
                mobileBinging:false,
                iPhoneX:false,
                showMore:false,
            }
        },
        computed: {
            isIphoneX: function(){
                return util.isIphoneX()
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        mounted () {
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                this.page = 1;
                this.debounce = false;
                this.detailList = [];
                this.balance = '';
                this.iPhoneX = /iphone/gi.test(navigator.userAgent) && (screen.height == 812 && screen.width == 375);
                commonPage.loadPageStatus('loading')
                this.$nextTick(() => {
                    this.Height = window.innerHeight - document.querySelector('header').offsetHeight - document.querySelector('.btn-box').offsetHeight;
                })
                util.ajax({
                    url:'/wallet/record/get',
                    type:'GET',
                    data:{page:this.page},
                    timeout:10000,
                    success:(data) => {
                        console.log("钱包流水"+JSON.stringify(data.data))
                        if(data.errno == 0){
                            if(data.data.records_data.length > 0){
                                this.detailList = data.data.records_data;
                                this.last_page = data.data.last_page;
                            }else{
                                this.empty = true;
                            }
                        }else{
                            widget.toast(data.errmsg)
                        }
                    },
                    error:(status) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    }
                });
                util.ajax({
                    url:'/wallet/get',
                    type:'GET',
                    data: {
                        'team_id': 0,
                        'project_id': 0,
                    },
                    timeout:10000,
                    success:(data) => {
                        commonPage.loadPageStatus('loadSuccess')
                        
                        if(data && data.errno == 0){
                            this.balance = data.data.balance
                        }else{
                            widget.toast(data.errmsg)
                        }
                    },
                    error:() => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    }
                });
            },
            //上拉加载
            listScroll(event){
                if(this.page > this.last_page) return;
                let scrollTop = $(event.target).scrollTop(),
                    listHeight = document.querySelector('ul').offsetHeight;
                if(scrollTop >= listHeight - this.Height && !this.debounce){
                    this.debounce = true;
                    this.showMore = true;
                    util.ajax({
                        url:'/wallet/record/get',
                        type:'GET',
                        data:{page:++this.page},
                        timeout:10000,
                        success:(data) => {
                            if(data.errno == 0){
                                if(data.data.records_data.length > 0){
                                    setTimeout(()=>{
                                        this.showMore = false;
                                        this.detailList = this.detailList.concat(data.data.records_data);
                                    },2000)
                                }else{
                                    this.showMore = false;
                                }
                            }else{
                                widget.toast(data.errmsg)
                            }
                            this.debounce = false;
                        },
                        error:() => {
                            this.debounce = false;
                            this.showMore = false;
                            widget.toast('服务器异常')

                        }
                    }) 
                }
            },
            //提现操作
            withdrawal(){         
                // ApiClientUi.addEV({'ev_str':'@ca_from=submit'})
                util.ajax({
                    url:'/wallet/check_bind',
                    type:'GET',
                    data:{
                        'team_id': 0,
                        'project_id': 0,
                    },
                    timeout:10000,
                    success:(data) => {
                        if(data.errno == 0){
                            let is_bind = data.data.is_bind
                            let account_type = data.data.account_type
                            if(is_bind == 1){
                                let encodeStr = encodeURIComponent(`last_pageUrl=${account_type}`)
                                location.href = `dmsaas://ApplyforWithdrawal?urdData=${encodeStr}`
                            }else{
                                location.href = "dmsaas://WithdrawalWay"  
                            }
                        }else{
                            widget.toast(data.errmsg)
                        }
                    },
                    error:function(status){
                        widget.toast('服务器异常')
                    }
                })   

            }
        },
        filters: {
            formatDateTime(date){
                return util.mywalletDate(date);
            }
        },
        created(){
           
            this.init();
            commonPage.updateTitleBar({
                backAction: 'goBack',
                leftAction: 'goBack'
            })
            window.goBack = () => {
                cache.getMemoryCache('jcIndexWebViewID',function(data){
                    if(data){
                        commonPage.goBack(1, {}, data.webViewID)
                    }
                })
            }
            commonPage.getWebViewID((data)=>{
              cache.setMemoryCache('yyMywalletWebViewID',{'webViewID':data})
            })
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<!-- <style src="static/css/global.css"></style> -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/base.css"></style>
<style src="../../static/css/yy_myWallet.css"></style>



